import 'package:flutter/material.dart';
import 'package:flutter_pro_01/components/shop_list.dart';

class MyApp20 extends StatelessWidget {
  const MyApp20({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('CustomScrollView基本使用'),
        backgroundColor: const Color.fromARGB(255, 232, 221, 10),
      ),
      // 将网格和列表混合使用
      // 例如上面为网格，下面为列表
      body: CustomScrollView(
        slivers: [
          SliverGrid.builder(
            gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisCount: 3,
              mainAxisSpacing: 10.0,
              crossAxisSpacing: 5.0,
            ),
            itemBuilder: (BuildContext context, int index) {
              return Container(color: Colors.greenAccent);
            },
            itemCount: 9,
          ),
          SliverList.builder(
            itemBuilder: (BuildContext context, int index) {
              return ShopList();
            },
            itemCount: 20,
          ),
        ],
      ),
    );
  }
}
